<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
    <title>布局    </title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="../../py/resources/share/control/core.css" rel="stylesheet" type="text/css" />
	<link href="../../py/resources/share/layout/absolute.css" rel="stylesheet" type="text/css" />
	<link href="../../py/resources/default/control/core.css" rel="stylesheet" type="text/css" />
    
	<script src="../../py/system.js" type="text/javascript"></script>
	<script src="../../py/System/Dom/Element.js" type="text/javascript"></script>
    <script src="../../py/System/Controls/Layout/LayoutEngine.js" type="text/javascript"></script>
    <script src="../../py/System/Controls/Layout/AdvanceLayout.js" type="text/javascript"></script>
    <script src="../../py/System/Controls/Layout/VerticalLayout.js" type="text/javascript"></script>
    
	<script src="../../test/assets/scripts/debug.js" type="text/javascript"></script>
		<script src="../assets/scripts/common.js" type="text/javascript"></script>
</head>	

<body style="padding:60px">
    <div id="ct" style="width:100%; height:100%; padding: 20px; " class="x-box">
        <div id="p1" style="background: yellow;" class="x-box">a</div>
		<div id="p2" style="background: green; height: 100px; width: 100px" class="x-box">b</div>
        <div id="p3" style="background: red; height: 200px; width: 100px" class="x-box">c</div>
    </div>
	
        <script type="text/javascript">
    
   
        var layout = new Layout.AbsoluteLayout();
        
        var ctrl = new Control({
            dom: 'ct',
            controls: [
                new Control({
                    dom: 'p1',
					left: 20,
					top: 10
                }),
                
                new Control({
                    dom: 'p2',
					left: 50,
					top: 40
                }),
                
                new Control({
                    dom: 'p3',
					left: 70,
					top: 60
                }),
                
                new Control({
                    dom: 'p4',
					left: 80,
					top: 70
                }),
                
                new Control({
                    dom: 'p5'
                })
            ]
        });
        
        
        
        layout.initLayout(ctrl);
        
        layout.layout(ctrl);
		
		
	
        </script>
		
</body>
</html>
